﻿@using System.Configuration
@{
    ViewBag.Title = "Quản Lý Sinh Viên";
    Layout = "~/Views/Shared/_Admin_Layout.cshtml";
}

@section CssImport
{
    <style>
        .child-opener-image
        {
            cursor: pointer;
        }
        .child-opener-image-column
        {
            text-align: center;
        }
        .jtable-dialog-form
        {
            min-width: 220px;
        }
        .jtable-dialog-form input[type="text"]
        {
            min-width: 200px;
        }
    </style>
}
<div id="div-main-menu" class="left-side-bar">
    @Html.Partial("_AdminMenu")
</div>
<div id="div-main-content" class="right-side-bar">
    <h2>QUẢN LÝ SINH VIÊN</h2>
    <div class="filtering">
    <form>
        <label>MSSV: </label><input type="text" name="studentCode" id="studentCode" />
        <label>Tên: </label><input type="text" name="name" id="name" />
        <label>Mã lớp</label><input type="text" name="classID" id="classID" />
        <button type="submit" id="LoadRecordsButton">Tìm Kiếm</button>
    </form>
</div>
    <div id="LibraryStudentContainer"></div>
    <script type="text/javascript">

    $(document).ready(function () {
        $('#LibraryStudentContainer').jtable({
            title: 'Students List',
            paging: true, //Enable paging
            pageSize: @ConfigurationManager.AppSettings["PageSize"],
            sorting: true, //Enable sorting
            defaultSorting: 'Code ASC',
            //openChildAsAccordion: true, //Enable this line to show child tabes as accordion style
            actions: {
                listAction: '@Url.Action("GetStudentList", "Student")',
                deleteAction: '@Url.Action("DeleteStudent","Student")',
                updateAction: '@Url.Action("UpdateStudent", "Student")',
                createAction: '@Url.Action("AddStudent", "Student")'
            },
            fields: {
                ID: {
                    key: true,
                    create: false,
                    edit: false,
                    list: false
                },
                UserName: {
                    title: 'Tên đăng nhập',
                    edit: false,
                    list: false
                },
                StudentCode: {
                    title: 'MS Sinh viên'
                },
                FirstName: {
                    title: 'Tên'
                    
                },
                LastName: {
                    title: 'Họ'
                },
                Birthday: {
                    title: 'Ngày sinh',
                    type: 'date',
                    displayFormat: 'yy-mm-dd'
                },
                Email: {
                    title: 'Email'
                },
                ClassID: {
                    title: 'Mã lớp'
                }            
            },
            //validate cac field trong bang Libraty_Books
            formCreated: function (event, data) {
                data.form.find('input[name="UserName"]').addClass('validate[required]');
                data.form.find('input[name="StudentCode"]').addClass('validate[required]');
                data.form.find('input[name="FirstName"]').addClass('validate[required]');

                data.form.find('input[name="LastName"]').addClass('validate[required]');
                data.form.find('input[name="Birthday"]').addClass('validate[required,custom[date]]');
                data.form.find('input[name="Email"]').addClass('validate[required,custom[email]]');
                data.form.find('input[name="ClassID"]').addClass('validate[required]');
               
                data.form.validationEngine();
            },
            formSubmitting: function (event, data) {
                return data.form.validationEngine('validate');
            },
            formClosed: function (event, data) {
                data.form.validationEngine('hide');
                data.form.validationEngine('detach');
            },
        });

        //Load person list from server
        $('#LoadRecordsButton').click(function (e) {
            e.preventDefault();
            $('#LibraryStudentContainer').jtable('load', {
                studentCode: $('#studentCode').val(),
                name: $('#name').val(),
                classID: $('#classID').val(),
            });
        });
        //Load all records when page is first shown
        $('#LoadRecordsButton').click();
    });

</script>
</div>
<div style="clear: both"></div>
